/* 
    Document   : scrollbar
    Created on : 29-Nov-2013, 08:53:48
    Author     : VU TUAN
    Description:
        Purpose of the stylesheet follows.
*/
/* Styled scrollbars */

.iScrollHorizontalScrollbar {
    position: absolute;
    z-index: 9999;
    height: 16px;
    left: 2px;
    right: 2px;
    bottom: 2px;
}

.iScrollHorizontalScrollbar.iScrollBothScrollbars {
    right: 18px;
}
.iScrollVerticalScrollbar {
    position: absolute;
    z-index: 9999;
    width: 4px;
    bottom: 2px;
    top: 2px;
    right: 2px;
}

.iScrollVerticalScrollbar.iScrollBothScrollbars {
    bottom: 18px;
}

.iScrollIndicator {
    position: absolute;
    border-radius: 0px;
}

.iScrollHorizontalScrollbar .iScrollIndicator {
    height: 100%;
}

.iScrollVerticalScrollbar .iScrollIndicator {
    width: 100%;
    background: rgba(0,0,0,.3);
}


/* end */


/**
 *
 * Horizontal Scrollbar
 *
*/
.myScrollbarH {
    position:absolute;
    z-index:100;
    height:8px;
    bottom:1px;
    left:2px;
    right:7px
}

.myScrollbarH > div {
    position:absolute;
    z-index:100;
    height:100%;

    /* The following is probably what you want to customize */
    background: rgba(0,0,0,.3);

    border:1px solid #900;
    -webkit-background-clip:padding-box;
    -moz-background-clip:padding-box;
    -o-background-clip:padding-box;
    background-clip:padding-box;

    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -o-box-sizing:border-box;
    box-sizing:border-box;

    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    -o-border-radius:4px;
    border-radius:4px;
}


/**
 *
 * Vertical Scrollbar
 *
*/
.myScrollbarV {
    position:absolute;
    z-index:100;
    width:4px;bottom:2px;top:2px;right:3px
}

.myScrollbarV > div {
    position:absolute;
    z-index:100;
    width:100%;
    
    background: rgba(2,145,65,.5);

    -webkit-background-clip:padding-box;
    -moz-background-clip:padding-box;
    -o-background-clip:padding-box;
    background-clip:padding-box;

    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -o-box-sizing:border-box;
    box-sizing:border-box;
}
